<template>
  <el-dialog width="58%" :title="title" :visible.sync="visible">
    <el-form ref="form" :model="model" :disabled="true" label-width="160px" size="small" v-loading="loading">
      <el-row>
        <el-col :span="12">
          <el-form-item prop="name" label="资产名称">
            <el-input placeholder="请输入资产名称" v-model="model.name"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="model" label="规格型号">
            <el-input placeholder="请输入规格型号" v-model="model.model"></el-input>
          </el-form-item>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item prop="unit" label="计量单位">
            <el-input placeholder="请输计量单位" v-model="model.unit"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="price" label="价格（元）">
            <el-input-number  controls-position="right" :precision="2" :step="0.1" placeholder="请输入价格" v-model="model.price"></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>

        <el-col :span="12">
          <el-form-item prop="buyer" label="购买单位">
            <el-input placeholder="请输入购买单位" v-model="model.buyer"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="manufacturer" label="供应商">
            <el-input placeholder="请输入购买单位" v-model="model.manufacturer"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item prop="isFixed" label="是否属于固定资产">
            <el-switch v-model="model.isFixed"></el-switch>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="isFax" label="是否含税">
            <el-switch v-model="model.isFax"></el-switch>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="使用期限" prop="usefulLife">
            <el-date-picker
              v-model="model.usefulLife" type="date" style="width: 100%;" placeholder="选择使用期限">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="state" label="资产状态">
            <el-select v-model="model.state" placeholder="请选择">
              <el-option :key="1" label="闲置" :value="1"></el-option>
              <el-option :key="2" label="已领用" :value="2"></el-option>
              <el-option :key="3" label="已处置" :value="3"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item prop="photo" label="资产照片">
            <image-upload v-model="model.photo" ></image-upload>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-divider content-position="center">资产处置信息</el-divider>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item prop="disContacts" label="资产处置联系人">
            <el-input placeholder="" v-model="model.disContacts"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="disPhone" label="联系电话">
            <el-input placeholder="" v-model="model.disPhone"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item prop="type" label="处置方式">
            <el-select v-model="model.disType" placeholder="请选择处置方式">
              <el-option :key="1" label="报废" :value="1"> </el-option>
              <el-option :key="2" label="出售" :value="2"> </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item prop="disDate" label="处置时间">
            <el-date-picker v-model="model.disDate" style="width: 100%;" type="date"  placeholder="选择日期"> </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item prop="disPhoto" label="资产处置照片">
            <image-upload v-model="model.disPhoto" ></image-upload>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item prop="disNote" label="备注">
            <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入内容"
              v-model="model.disNote">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <!--        <div  v-if="!disableSubmit"  slot="footer" class="dialog-footer">-->
    <!--          <el-button @click="handleCancel">取 消</el-button>-->
    <!--          <el-button type="primary" @click="handleSubmit">确 定</el-button>-->
    <!--        </div>-->
  </el-dialog>
</template>

<script>

  import Vue from 'vue'
  import { MessageBox, Message,Notification } from 'element-ui'
  import pick from 'lodash.pick'
  import { ACCESS_TOKEN } from "@/store/mutation-types"
  import ImageUpload from "@/components/ImageUpload"
  import { getAction,deleteAction,putAction,postAction } from '@/api/manage'

  export default {
    name: "DisViewModal",
    components: {
      ImageUpload
    },
    data () {
      return {
        title:"查看",
        visible: false,
        loading:false,
        model: {},
        url: {

        },  // 新增资产表单验证
      }
    },
    created () {
      const token = Vue.ls.get(ACCESS_TOKEN);
      this.headers = {"X-Access-Token":token}

    },
    methods: {
      edit (record) {
        let that = this;
        this.visible = true;
        if(that.$refs.form){
          that.$refs.form.resetFields();
          that.model = Object.assign({}, record);
        }else{
          this.$nextTick(() => {
            that.$refs.form.resetFields();
            that.model = Object.assign({}, record);
          })
        }
      }
    }
  }
</script>

<style scoped>

</style>
